<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>登录</title>
    <link rel="stylesheet" href="../../../static/layui/css/layui.css"/>
    <link rel="stylesheet" href="../../../static/css/login.css"/>
</head>
<body>
<div class="main">
    <div class="header">
        <img src="../../../static/img/mylogo.png" alt=""/>
        <p>后台管理系统</p>
    </div>
    <div class="body">
        <form class="layui-form login-form">
            <div class="layui-form-item">
                <label class="user-login layui-icon layui-icon-username" for="account"></label>
                <input type="text" name="account" value="{{{if isset($userName)}}}{{{$userName}}}{{{/if}}}" placeholder="账号" class="layui-input"/>
            </div>
            <div class="layui-form-item">
                <label class="user-login layui-icon layui-icon-password" for="password"></label>
                <input type="password" name="password" value="{{{if isset($userPwd)}}}{{{$userPwd}}}{{{/if}}}" placeholder="密码" class="layui-input"/>
            </div>
            <div class="layui-form-item">
                <div class="layui-row">
                    <div class="layui-col-xs7">
                        <label class="user-login layui-icon layui-icon-vercode" for="code"></label>
                        <input type="text" name="code" placeholder="图形验证" class="layui-input"/>
                    </div>
                    <div class="layui-col-xs5">
                        <div style="margin-left: 10px;">
                            <img src="../../util/captcha/generate"
                                 onclick="this.src = '../../util/captcha/generate?'+Math.random();" alt="验证码">
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-form-item" style="margin-bottom: 20px;">
                <input type="checkbox" name="remember" lay-skin="primary" title="记住密码"/>
            </div>
            <div class="layui-form-item">
                <button class="layui-btn layui-btn-fluid" lay-submit lay-filter="formDemo">登录</button>
            </div>
        </form>

        <div style="text-align: center;">
            <a href="./register">没有账户? 点击注册</a>
        </div>
    </div>
</div>

<script src="../../../static/layui/layui.js" type="text/javascript" charset="utf-8"></script>
<script>
    layui.use(['form'], function () {
        var form = layui.form
        $ = layui.jquery

        //提交
        form.on('submit(formDemo)', function (data) {
            // layer.msg(JSON.stringify(data.field));
            var formData = data.field
            formData.account = formData.account.trim()
            formData.password = formData.password.trim()
            formData.code = formData.code.toLowerCase()
            console.log(formData)
            // 发送AJAX请求
            $.ajax({
                url: './login', // 替换为你的服务器处理文件的URL
                type: 'POST',
                data: JSON.stringify(formData),
                processData: false, // 告诉jQuery不要处理发送的数据
                dataType: 'json',
                success: function (res) {
                    if (res.code === 200) {
                        layer.msg(res.msg,{icon:1})
                        setTimeout(() => {
                                window.location.href = '../index'
                            }
                            , 1000)
                    } else {
                        layer.msg(res.msg,{icon:2})
                    }
                },
                error: function (jqXHR, textStatus, errorMessage) {
                    layer.msg(res.msg,{icon:2})
                }
            });
            return false;
        });
    });
</script>
</body>
</html>